<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>在线反馈</title>
    <link rel="stylesheet" href="/Public/css/bootstrap.min.css">

    <link href="/Public/css/animate.css" rel="stylesheet">
    <link rel="stylesheet" href="/Public/css/toast.css">
    <link rel="stylesheet" href="/Public/css/gxxjkefu-normalize.css">
    <link rel="stylesheet" href="/Public/css/model.css">
    <link rel="stylesheet" href="/Public/css/style.css">
    <link rel="stylesheet" href="/Public/css/pager.css">
    <link rel="stylesheet" href="/Public/css/bootstrap-grid.min.css">
    <link rel="stylesheet" href="/Public/css/zoomify.min.css">

    <style>
        body {
            font-size: 12px;
        }

        .modal-backdrop {
            position: relative;
            top: 0;
            right: 0;
            bottom: 0;
            left: 0;
            z-index: 1040;
            background-color: #000;
        }

        .notice_info {
            padding: 25px 2% 3%;
            color: #979797;
            float: left;
            width: 90%;
            background: #ffffff;
        }

        .input_info input {
            padding: 5px 10px;
            width: 40%;
        }

        .user_info_survey .title_div {
            display: inline-block;
            width: 15%;
            height: 100px;
            line-height: 100px;
            text-align: right;
            padding-right: 30px
        }

        .user_info_survey .title_div2 {
            width: 11%;
            height: 40px;
            line-height: 40px;
        }

        .urgency_ul li {
            color: #333333;
            margin-bottom: 10px;
        }

        .urgency_list .list_span {
            margin-right: 50px;
        }

        .clearfloat:after {
            display: block;
            clear: both;
            content: "";
            visibility: hidden;
            height: 0
        }

        .clearfloat {
            background: white;
            zoom: 1
        }

        .pageJump {
            margin-top: 20px;
        }

        .pageJump input {
            width: 45px;
            height: 25px;
        }

        .btn_div {
            padding-left: 10%;
            margin-bottom: 2%;
        }

        .btn_div input {
            border-radius: 5px;
        }

        .back_btn {
            width: 61px;
            height: 30px;
            border: none;
            float: right;
            background: url(/Public/image/back_btn.jpg) no-repeat center;
        }

        .common_btn {
            float: left;
            height: 30px;
            margin-right: 20px;
            border: solid 1px #ececec;
            color: #5d5e60;
            background: none;
        }

        .common_btn:hover {
            color: white;
            background: #abdde6;
            border: solid 1px #abdde6;
        }
    </style>
</head>
<body>
<div class="scrollbar animated fadeInRight" id="style-1"
     style="overflow:scroll;overflow-x:hidden;margin: 0;width: 100%">
    <div id="main_C" style="width: 99%;">
        <div class="clearfloat">
            <div class="title_info">
                <span>调查</span>
            </div>
            <div class="white_bgColor notice_info" id="myModal">
                <div class="btn_div clearfloat">
                    <input class="back_btn" type="button" onclick="javascrtpt:window.history.go(-1)"/>
                    <input class="common_btn" type="button" data-toggle="modal" data-target=".bs-example-modal-sm1"
                           value="快捷处理"/>
                    <input class="common_btn" type="button" data-toggle="modal" data-target=".bs-example-modal-sm2"
                           value="查记"/>
                    <input class="common_btn" type="button" onclick="mark_detail()" value="沟通详情"/>
                    <!--<input class="common_btn" type="button" onclick="turn_kf()" value="驳回预审"/>-->
                    <div>
                        <if condition="$user.refuse_status eq '3'">
                            <label>审核结果：</label>
                            <label><{$user.refuse_content}></label>
                        </if>
                    </div>
                    <div>
                        <if condition="$user.refuse_status eq '3'">
                            <label>审核标签：</label>
                            <label><{$tag}></label>
                        </if>
                    </div>
                </div>
                <div class="modal fade bs-example-modal-sm1 " style="background: none" tabindex="-1" role="dialog"
                     id="div_quick"
                     aria-labelledby="mySmallModalLabel">
                    <div class="modal-dialog" role="document" id="quick_mark">
                        <div class="modal-content">
                            <volist name="quick_answer" id="vo">
                                <input type="button" value="<{$vo.title}>" onclick="answer('<{$vo.title}>')"/>
                            </volist>
                        </div>
                    </div>
                </div>
                <div class="modal fade bs-example-modal-sm2" style="background: none" tabindex="-1" role="dialog"
                     aria-labelledby="mySmallModalLabel" id="div_mark">
                    <div class="modal-dialog" role="document" id="content">
                        <div class="modal-content">
                            <textarea name="" id="content_mark" cols="63" rows="10" placeholder="请输入备注信息"></textarea>
                            <input type="button" value="确定" onclick="mark()"/>
                        </div>
                    </div>
                </div>
                <form class="user_info_survey">
                    <div style="display: flex;align-items: center">
                        <div class="title_div" style="width: 17%"><p>人脸照片</p></div>
                        <div class="row" style="display: inline-block">
                            <div class="example col-xs-1 col-md-1">
                                <p><img src="<{$user_pic.photo}>" class="img-rounded" width="100%" height="100%"/></p>
                            </div>
                            <div class="example col-xs-1 col-md-1">
                                <p><img src="<{$user_pic.photo1}>" class="img-rounded" width="100%" height="100%"/></p>
                            </div>
                            <div class="example col-xs-1 col-md-1">
                                <p><img src="<{$user_pic.photo2}>" class="img-rounded" width="100%" height="100%"/></p>
                            </div>
                        </div>
                    </div>
                    <div style="display: flex;align-items: center">
                        <div class="title_div" style="width: 27%"><p>身份照片</p></div>
                        <div class="row" style="display: inline-block">
                            <div class="example col-xs-1 col-md-1">
                                <p><img src="<{$user_pic.front}>" width="100%" height="100%" class="img-rounded"/></p>
                            </div>
                            <div class="example col-xs-1 col-md-1">
                                <p><img src="<{$user_pic.behind}>" width="100%" height="100%" class="img-rounded"/></p>
                            </div>
                        </div>
                    </div>
                    <div style="display: flex;align-items: center;margin-bottom: 15px" class="input_info">
                        <div class="title_div title_div2"><p>手机号码</p></div>
                        <input type="text" value="<{$user.user_mobile}>"/>
                    </div>
                    <div style="display: flex;align-items: center;margin-bottom: 15px" class="input_info">
                        <div class="title_div title_div2">
                            <p>身份证号</p></div>
                        <input type="text" value="<{$user.id_card}>"/>
                    </div>
                    <div style="display: flex;align-items: center;margin-bottom: 15px" class="input_info">
                        <div class="title_div title_div2">
                            <p>现居住地</p></div>
                        <input type="text" value="<{$user.address}>"/>
                    </div>
                    <div style="display: flex;align-items: center;margin-bottom: 15px" class="input_info">
                        <div class="title_div title_div2">
                            <p>信用评分</p></div>
                        <input type="text" value="<{$user.score}>"/>
                    </div>

                    <div style="display: flex;align-items: center;margin-bottom: 15px" class="input_info">
                        <div class="title_div title_div2">
                            <p>命中项</p></div>
                        <!--<input id="user_target" type="text" style="height: 80px" />-->
                        <textarea id="user_target" clos="50" rows="5" warp="virtual" style="width: 400px"> </textarea>
                        <!--<textarea id="user_target"  clos="50" rows="5" warp="virtual" />-->
                    </div>
                    <ul class="urgency_ul">
                        <li class="urgency_list">
                            <span class="list_span">紧急联系人：<span
                                    class="gray_color"><{$user_contact.relative_name}></span></span>
                            <span class="list_span">紧急联系号码：<span
                                    class="gray_color"><{$user_contact.relative_mobile}></span></span>
                            <span class="list_span">关系：<span class="gray_color"><{$user_contact.r_type}></span></span>
                            <span class="list_span">通话次数：<span
                                    class="gray_color"><{$user_contact.contact_sum}></span></span>
                        </li>
                        <li class="urgency_list">
                            <span class="list_span">紧急联系人：<span
                                    class="gray_color"><{$user_contact.other_name}></span></span>
                            <span class="list_span">紧急联系号码：<span
                                    class="gray_color"><{$user_contact.other_mobile}></span></span>
                            <span class="list_span">关系：<span class="gray_color"><{$user_contact.f_type}></span></span>
                            <span class="list_span">通话次数：<span class="gray_color"><{$user_contact.contact_sum2}></span></span>
                        </li>
                    </ul>
                    <hr>
                    </br>
                    <ul class="urgency_ul">
                        <li class="urgency_list">
                            <span class="list_span"><a onclick="verify(2)">工作认证：</a><{$user.work_verify}></span>
                            <span class="list_span"><a onclick="verify(1)">社保认证：</a><{$user.shebao_verify}></span>
                            <span class="list_span"><a onclick="verify(3)">淘宝认证：</a><{$user.taobao_verify}></span>
                            <span class="list_span"><a onclick="verify(4)">京东认证：</a><{$user.jd_verify}></span>
                        </li>
                        <li class="urgency_list">
                            <span class="list_span"><a onclick="verify(5)">信用卡认证：</a><{$user.credit_verify}></span>
                            <span class="list_span"><a onclick="verify(6)">学历认证：</a><{$user.edu_verify}></span>
                            <span class="list_span"><a onclick="verify(7)">支付宝认证：</a><{$user.alipay_verify}></span>
                        </li>
                    </ul>
                </form>
            </div>
        </div>
        <div class="clearfloat" style="padding-bottom: 30px">
            <div class="title_info">
                <span>用户通讯录</span>
            </div>
            <div style="width: 95%;margin: 20px auto;border: solid 1px #cccccc;">
                <table class="table table-hover">
                    <thead>
                    <tr>
                        <th>名字</th>
                        <th>手机号码</th>
                        <th>通话次数</th>
                    </tr>
                    </thead>
                    <tbody id="t_list">

                    </tbody>
                </table>
                <!--分页-->
                <div style="text-align: center;margin: 0px auto 0">
                    <ul class="pagination" id="page2"></ul>
                    <div class="pageJump">
                        <span>跳转到</span>
                        <input type="text"/>
                        <span>页</span>
                        <button type="button" class="button"></button>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<script src="/Public/js/pager.js"></script>
<script src="/Public/js/jquery-3.2.1.js"></script>
<script src="/Public/js/bootstrap.min.js"></script>
<script src="/Public/js/zoomify.min.js"></script>
<script src="/Public/js/toast.js"></script>
<script src="/Public/js/layer/layer.js"></script>
<script src="/Public/js/layui/layui.js"></script>

<script>
    var vid = "<{$vid}>";
    var url = "<{$SERVER_NAME}>/AntiUser/user_contact";
    function turn_kf() {
        var index = layer.load(1, {
            shade: [0.1, '#fff'] //0.1透明度的白色背景
        });

        layer.alert("确定转预审？", {title: '提示框', icon: 3}, function (index) {

            $.post("<{$SERVER_NAME}>/AntiUser/turn_kf", {vid: vid}, function (data) {
                console.log('3423423', data);
                if (data.code == "1001") {
                    layer.alert(data.result, {title: '提示框', icon: 1});

                }
                else {
                    layer.alert(data.result, {title: '提示框', icon: 2});
                }
            });
            layer.close(index);
        });
        layer.close(index);
    }
    //认证
    function verify(type) {
        var url = '';
        switch (type) {
            case 1: //社保认证
//                url='<{$SERVER_NAME}>/WorkCert/work_cert.html?vid='+vid;
                break;
            case 2: //工作认证
                url = '<{$SERVER_NAME}>/WorkCert/work_cert.html?vid=' + vid;
                break;
        }
        layer.open({
            title: '认证信息',
            type: 2,
            area: ['80%', '80%'],
            maxmin: true,
            offset: '100px',
            content: url,
            success: function (layero) {
                layero.find('.layui-layer-min').remove();
            }
        });
    }

    //风控接口获取命中项
    $.post("http://nfk.jyyjrfw.com/interface/get_code", {vid: vid}, function (data) {
        $("#user_target").val(data);
    });

    $.post(url, {page: 1, vid: vid}, function (data) {
        console.log('09090', data);
        if (data.code = '1001') {
            var obj = data.result;
            var len = obj.length;
            var s = "";
            if (data.count < 6) {
                $("#page1").hide();
            }
            Page({
                num: data.total,					//页码数
                startnum: 1,				//指定页码
                elem: $('#page2'),		//指定的元素
                callback: function (n) {	//回调函数
                    get_contact(n);
                }
            });

            for (var i = 0; i < len; i++) {
                s += "  <tr> <td>" + obj[i].name + "</td> <td>" + obj[i].call_other_number + "</td> <td>" + obj[i].num + "</td> </tr>";
            }
            document.getElementById("t_list").innerHTML = s;
        } else {

        }
    });

    //获取联系人
    function get_contact(n) {
        $.post(url, {page: n, vid: vid}, function (data) {
            if (data.code = '1001') {
                var obj = data.result;
                var len = obj.length;
                var s = "";
                for (var i = 0; i < len; i++) {
                    s += "  <tr> <td>" + obj[i].name + "</td> <td>" + obj[i].call_other_number + "</td> <td>" + obj[i].num + "</td> </tr>";
                }
                document.getElementById("t_list").innerHTML = s;
            } else {

            }
        });
    }


    //查记
    function mark() {
        var index = layer.load(1, {
            shade: [0.1, '#fff'] //0.1透明度的白色背景
        });
        var content = $("#content_mark").val();
        content = content.replace(/(\n)+|(\r\n)+/g, "");//去掉换行
        var url = "<{$SERVER_NAME}>/AntiUser/outbound_result";
        if (content == "" || content == null) {
            layer.close(index);
            $('#content').toast({
                content: '回复不能为空！',
                duration: 1000
            });
            return false;
        }

        $.post("http://fk.jyyjrfw.com/Interface/create_detail", {vid: vid}, function (data) {

        });

        layer.alert("确定备注！", {title: '提示框', icon: 3}, function (index) {

            $.post(url, {vid: vid, content: content}, function (data) {
                console.log('3423423', data);
                if (data.code == "1001") {
                    $('#content').toast({
                        content: '备注成功！',
                        duration: 1000
                    });
                    $("#content_mark").val("");
                    $('#div_mark').modal('hide');
                }
                else {
                    layer.alert(data.result, {title: '提示框', icon: 2});
                }
            });
            layer.close(index);
        });
        layer.close(index);
    }

    //沟通详情
    function mark_detail() {
        window.location.href = "<{$SERVER_NAME}>/AntiUser/survey_details?vid=" + vid;
    }

    //    快捷回复
    function answer(mark) {

        var index = layer.load(1, {
            shade: [0.1, '#fff'] //0.1透明度的白色背景
        });

        if (mark == "") {
            layer.close(index);
            layer.alert("请信息填写完整！\r\n", {
                title: '提示框',
                icon: 0,
            });
            return false;
        }

        $.post("http://fk.jyyjrfw.com/Interface/create_detail", {vid: vid}, function (data) {

        });

        var url = "<{$SERVER_NAME}>/AntiUser/outbound_result";
        layer.alert("确定备注！", {title: '提示框', icon: 3}, function (index) {
            $.post(url, {vid: vid, content: mark, quick_status: '1'}, function (data) {
                if (data.code == "1001") {
                    $('#quick_mark').toast({
                        content: '成功！',
                        duration: 1000
                    });
                    $('#div_quick').modal('hide');
                }
                else {
                    layer.alert(data.result, {title: '提示框', icon: 2});
                }
            });
            layer.close(index);
        });
        layer.close(index);
    }
    $('.example img').zoomify();
    //    $('#myModal').modal(options);
</script>
</body>
</html>